<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数组解构_基本语法</title>
    <style>
        .标注 {
            color: red;
            font-size: 20px;
        }
    </style>
</head>
<body>
<p>
    数组解构 是将数组的单元值快速 批量赋值给一系列变量 的简洁语法
</p>
<h3>基本语法：</h3>
<p>
    1. 赋值运算符 = 左侧的 [] 用于批量声明变量，右侧数组的单元值将被赋值给左侧的变量 <br>
    2. 变量的顺序对应数组单元值的位置依次进行赋值操作
</p>
<hr>
<pre class="标注">
1. 数组解构赋值的作用是什么？
    是将数组的单元值快速批量赋值给一系列变量的简洁语法
2. JS 前面有两哪种情况需要加分号的？
    立即执行函数 (匿名函数)
    数组解构
</pre>

<script>
    const 数组 = [100, 60, 80]
    // 数组解构 赋值, 相当于批量赋值
    // const [最大值, 最小值, 平均值] = [100, 60, 80]
    const [最大值, 最小值, 平均值] = 数组  // 注意顺序要对应

    console.log(最大值) // 100
    console.log(最小值) // 80


    // 一个简单的应用场景, 交换2个变量的值
    let a = 1
    let b = 2
    ;[a, b] = [b, a] // 这样简单的,互换了变量. 比以前的方法要简洁的多
    // 注意 ; 号,必须加. 存在数组解构赋值的情况前面加 ; 代表它是单独一行代码

    console.log(a, b) // 输出控制台


    // 案例: 请将最大值和最小值函数返回值解构 max 和 min 两个变量
    function 函数() {
        return [300, 66]
    }

    const [最大值1, 最小值1] = 函数() // 函数的返回值 数组,批量赋值给变量
    console.log(最大值1)
    console.log(最小值1)
</script>
</body>
</html>